import React, {PureComponent} from 'react';
import {Tag, Icon} from 'antd';
import TaskDetailBasicInfomation from './TaskDetailBasicInfomation';//基础信息
import TaskDetailAttendanceRules from './TaskDetailAttendanceRules';//出勤规则
import TaskDetailPublishSetting from './TaskDetailPublishSetting';//任务成员名单
import TaskDetailPersonnelPlacement from './TaskDetailPersonnelPlacement';//人员排班
import TaskDetailAttendanceTrack from './TaskDetailAttendanceTrack';//出勤及轨迹
import TaskDetailTaskDynamics from './TaskDetailTaskDynamics';//任务动态
import TaskDetailRelatedMatters from './TaskDetailRelatedMatters';//关联事项
import Menu from './Menu';//关联事项
import {gup} from '../../../utils/utils';
import PLoading from '../../../components/Pro/PLoading';
import PAMapPath from '../../../components/Pro/PAMapPath';
import {taskGetStepOneDetail} from "../../../services/api";

import {Breadcrumb} from 'antd';
import {Link} from "dva/router";
// import { connect } from 'dva';

const status = {
  0: "未开始",
  1: "进行中",
  2: "已完成", //不可修改
  3: "已延期",
  4: "已取消", //不可修改
  5: "已暂停",
  6: "未发布",
  7: "已结束", //不可修改
};
const iconStyle = {float: "right", margin: "-40px 35px 0px 0px", cursor: "pointer"};

const paths2 = [
  [116.405289, 39.904987],
  [113.964458, 45.54664],
  [121.47836, 41.135964],
  [108.949297, 43.670904],
  [110.380111, 42.149509],
  [103.774185, 45.56996],
  [101.135432, 42.930601],
  [92.46826, 43.229964],
  [95.777529, 43.466798],
  [93.068486, 43.64009],
  [90.34669, 43.749086],
  [87.61792, 43.793308]
];
const paths1 = [
  [118.052565, 24.607096],
  [118.052086, 24.607106],
  [118.052077, 24.607095],
  [118.052077, 24.607095],
  [118.052097, 24.607077],
  [118.052091, 24.607083],
  [118.052091, 24.607083],
  [118.052077, 24.607096],
  [118.052091, 24.607091],
  [118.052082, 24.607116],
  [118.052107, 24.607088],
  [118.052107, 24.607088],
  [118.052428, 24.606763],
  [118.052201, 24.606980],
  [118.052036, 24.607122],
  [118.052534, 24.607155],
  [118.052145, 24.607099],
  [118.052585, 24.607108],
  [118.052581, 24.607101],
  [118.052599, 24.607067],
  [118.052618, 24.607017],
  [118.052619, 24.607016],
  [118.052012, 24.606695],
  [118.052605, 24.60703],
  [118.052616, 24.607019]
]
/**
 * 配置角色及权限
 */
export default class NewTask extends PureComponent {
  constructor(props, context) {
    super(props, context);
    this.state = {
      comTaskId: gup("id"),
      cursor: 0,
      taskInfo: {taskStatus: "0"},
      basicInfo: {},//基础信息
      paths: paths1
    };
  }

  /******************************生命周期******************************/

  componentDidMount = () => {
    this.taskGetStepOneDetail();
    setTimeout(() => {
      this.setState({
        paths: paths2
      });
    }, 8000)
  }

  componentWillReceiveProps = () => {

  }
  /******************************ajax请求******************************/

  taskGetStepOneDetail = () => {
    console.log(this.state.comTaskId)
    taskGetStepOneDetail({comTaskId: this.state.comTaskId}).then(
      (data) => {
        if (!data.data) {
          return;
        } else {
          this.setState({
            basicInfo: data.data,
            cursor: gup("cursor") || 1,
          });
        }

      }, (err) => {
        console.log(err);
      });
  }

  /******************************相关事件******************************/
  clickHand = (cursor) => {
    this.setState({cursor});
  }


  /******************************render******************************/
  // taskStatus taskName
  render() {
    const {cursor, comTaskId, basicInfo} = this.state;
    const {taskStatus, taskName} = basicInfo;
    const pages = {
      0: <PLoading/>,
      1: <TaskDetailBasicInfomation/>,//基础信息
      2: <TaskDetailAttendanceRules/>,//出勤规则
      3: <TaskDetailPublishSetting/>,//任务成员名单
      4: <TaskDetailPersonnelPlacement/>,//人员排班
      5: <TaskDetailAttendanceTrack/>,//出勤及轨迹
      6: <TaskDetailTaskDynamics/>,//任务动态
      7: <TaskDetailRelatedMatters/>,//关联事项
    };


    return (
      // 每次只加载一个模块
      <div className="TaskDetail">
        {/*<PAMapPath paths={this.state.paths}/>*/}
        <Breadcrumb style={{margin: "20px 0"}}>
          <Breadcrumb.Item>
            <Link to="/taskmanager/tasklist">
              任务列表
            </Link>
          </Breadcrumb.Item>
          <Breadcrumb.Item>任务详情</Breadcrumb.Item>
        </Breadcrumb>

        <div className="taskdetail-title">
          {taskName}<Tag>{status[taskStatus]}</Tag>
        </div>
        {/[^247]/.test(taskStatus) && (
          <Icon
            type="edit"
            style={iconStyle}
            onClick={() => this.props.history.push(`/taskmanager/newtask?id=${comTaskId.toString()}&model=detail`)}
          />)}
        <Menu current={cursor} clickHand={this.clickHand}/>
        {
          React.cloneElement(
            pages[cursor],
            {
              comTaskId,
              basicInfo,
            },
          )
        }
      </div>
    );
  }
}

